<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script src="../js/vue.min.js" type="text/javascript" charset="utf-8"></script>
	</head>
	<body>
		<div id="app">
			<counter></counter>
			<hr />
			<counter></counter>
			<hr />
			<counter></counter>
		</div>
		
		<template id="tmpl">
			<div>
				<input type="button" name="" id="" value="+1" @click="increment" />
				<h3>{{count}}</h3>
			</div>
		</template>
		
		<script type="text/javascript">
			var dataObj={count:0}
			
			Vue.component('counter',{
				template:'#tmpl',
				data:function(){
					return {count:0}
				},
				methods:{
					increment(){
						this.count++
					}
				}
			})
			
			new Vue({
				el:"#app"
			});
		</script>
	</body>
</html>
